/**
 * @class NG.views.Viewport
 * @extends {Ext.TabPanel}
 * 
 * Viewport of the application. It is extended from Ext.TabPanel class.
 */
NG.views.Viewport = Ext.extend(Ext.TabPanel, {
    fullscreen: true,
    layout: 'card',
    
    /**
     * Default value is 'slide'.
     * @property cardSwitchAnimation
     * @type String
     */
    cardSwitchAnimation: 'slide',
    tabBar: {
    	id: 'viewport-tabbar',
        dock: 'bottom',
        layout: {
            pack: 'center'
        }
	},
	
	/**
	 * @private
	 */
    initComponent: function() {
		NGLogger.info('Viewport init');

		//put instances of cards into app.views namespace
        Ext.apply(app.views, {
        	index: new NG.views.Index()
            ,mapView: new NG.views.MapView()
            //,denemeView: new app.views.DenemeView()
            //,workspaceForm: new NG.views.WorkspaceForm()
			,workspaceList: new NG.views.WorkspaceList()
			,searchView: new NG.views.SearchView()
        });
								 
        //put instances of cards into viewport
        Ext.apply(this, {
            items: [
            	app.views.index
				,app.views.mapView
				//,app.views.denemeView
				,app.views.workspaceList
				,app.views.searchView
				//,app.views.workspaceForm
           ]
        });
        NG.views.Viewport.superclass.initComponent.apply(this, arguments);
    },
    
    /**
     * 
     * @return {Ext.Button} Search toolbar button of the viewport.
     */
    getSearchToolbarButton: function (){
    	return this.getTabBar().items.items[3];
    },
    
    /**
     * 
     * @return {Ext.Button} Map toolbar button of the viewport.
     */
    getMapToolbarButton: function (){
    	return this.getTabBar().items.items[1];
    },
    
    /**
     * Activates and brings search panel to top.
     * @param {Object} options
     */
    activateSearchView: function (options) {
		this.setActiveItem(3, options.animation);
    },
    
    /**
     * Sets badge information of search button of viewport. There are two information item.
     * One is info list size, other is info detail list size. If there is no detail size in params object,
     * no info is displayed in badge information.
     * 
     * @param {Object} params Includes infoListSize, infoDetailListSize.
     */
    setSearchButtonBadgeText: function (params) {
    	params = params || {};
    	var infoListSize = params.infoListSize;  
    	var infoDetailListSize = params.infoDetailListSize;
    	if (Ext.isEmpty(infoListSize))
    		infoListSize = "";
    	else 
    		infoListSize = "[ " + infoListSize + " ]";
    	if (Ext.isEmpty(infoDetailListSize))
    		infoDetailListSize = "";
    	else 
    		infoDetailListSize = "[ " + infoDetailListSize + " ]";
    	this.getSearchToolbarButton().setBadge(infoListSize + infoDetailListSize);
    }


});
